@prefix: bs-;

// Color
@primary-color: #2d8cf0;
@info-color: #2db7f5;
@success-color: #19be6b;
@warning-color: #ff9900;
@error-color: #ed3f14;
@link-color: #2D8cF0;
@link-hover-color: tint(@link-color, 20%);
@link-active-color: shade(@link-color, 5%);
@selected-color: fade(@primary-color, 90%);
@subsidiary-color: #80848f;
@rate-star-color: #f5a623;
 
// Base
@body-background: #fff;
@theme-background: #fff;
@theme-link-color: #fff;
@theme-link-color-active: @primary-color;
@pane-background: #fff;
@font-family: "Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","微软雅黑",Arial,sans-serif;
@code-family: Consolas,Menlo,Courier,monospace;
@text-color: #495060;
@font-size-base: 14px;
@font-size-small: 12px;
@line-height-base: 1.5;
@line-height-computed: floor((@font-size-base * @line-height-base));
@border-radius-base: 6px;
@border-radius-small: 4px;
@cursor-disabled: not-allowed;

// Border color
@border-color-base: #dddee1;  // outside
@border-color-split: #e9eaec;  // inside

// Background color
@background-color-base: #f7f7f7;  // base
@background-color-select-hover: @input-disabled-bg;
@head-bg: #f9fafc;
@date-picker-cell-hover-bg: #e1f0fe;
@progress-inner-bg: #f3f3f3;

// Shadow
@shadow-color: rgba(0, 0, 0, .2);
@shadow-base: @shadow-down;
@shadow-card: 0 1px 1px 0 rgba(0,0,0,.1);
@shadow-up: 0 -1px 6px @shadow-color;
@shadow-down: 0 1px 6px @shadow-color;
@shadow-left: -1px 0 6px @shadow-color;
@shadow-right: 1px 0 6px @shadow-color;


// Button
@btn-font-weight: normal;
@btn-padding-base: 6px 15px;
@btn-padding-large: 6px 15px 7px 15px;
@btn-padding-small: 2px 7px;
@btn-font-size: 12px;
@btn-font-size-large: 14px;
@btn-border-radius: 4px;
@btn-border-radius-small: 3px;
@btn-border-radius-large: 6px;
@btn-group-border: shade(@primary-color, 5%);

@btn-disable-color: #bbbec4;
@btn-disable-bg: @background-color-base;
@btn-disable-border: @border-color-base;

@btn-default-color: @text-color;
@btn-default-bg: @background-color-base;
@btn-default-border: @border-color-base;

@btn-primary-color: #fff;
@btn-primary-bg: @primary-color;
@btn-primary-border: darken(@btn-primary-bg, 5%);

@btn-ghost-color: @text-color;
@btn-ghost-bg: transparent;
@btn-ghost-border: @border-color-base;

@btn-success-color: #fff;
@btn-success-bg: @success-color;
@btn-success-border: darken(@btn-success-bg, 5%);

@btn-info-color: #fff;
@btn-info-bg: @info-color;
@btn-info-border: darken(@btn-info-bg, 5%);

@btn-warning-color: #fff;
@btn-warning-bg: @warning-color;
@btn-warning-border: darken(@btn-warning-bg, 5%);

// btn-icon
@btn-icon-width: 36px;
@btn-icon-size: 14px;
@btn-icon-color: #cfd7e6;
@btn-icon-bg: #5676aa;
@btn-icon-radius: 3px;
@btn-icon-color-hover: #fff;
@btn-icon-bg-hover: #fa893b;
@btn-icon-color-active: #fff;
@btn-icon-bg-active: #d66c23;
@btn-icon-color-disabled: #9298a4;
@btn-icon-bg-disabled: #5676aa;



// Input / select
@input-height-base: 32px;
@input-height-large: 36px;
@input-height-small: 24px;

@input-padding-horizontal: 7px; // 左右边距
@input-padding-vertical-base: 4px; // 上下边距
@input-padding-vertical-small: 1px;
@input-padding-vertical-large: 6px;

@input-placeholder-color: @btn-disable-color;
@input-color: @text-color;
@input-border-color: @border-color-base;
@input-bg: #fff;

@input-hover-border-color: @primary-color;
@input-focus-border-color: @primary-color;
@input-disabled-bg: #f3f3f3;


// checkbox & radio
@checkbox-color: @primary-color;
@checkbox-border-color: @border-color-base;
@radio-color: @primary-color;


// layout 布局
@layout-content-padding: 10px 20px;
@layout-left: 300px;
@layout-right: 300px;
@layout-gap: 10px;
// 栅格
@grid-columns: 24;
@grid-gutter-width: 0;


// close
@close-font-weight: bold;
@close-color: #000;
@close-text-shadow: 0 1px 0 #fff;


// table
@table-bg-base: #fff;
@table-td-bg-base: #fff;
@table-td-color: @text-color;
@table-thead-bg: #f8f8f9;
@table-td-hover-bg: #ebf7ff;
@table-td-highlight-bg: #ebf7ff;  // 表格高亮
@table-height: 48px;
@table-padding: 0 10px;
@table-th-height: 40px;
@table-cell-padding: 0 18px;
@table-th-large-height: 48px;
@table-td-large-height: 60px;
@table-th-small-height: 32px;
@table-td-small-height: 40px;
@table-border-color-split: @border-color-split;

// tab
@tab-height: 40px;
@tab-padding: 0 20px;

// form
@form-label-padding: 10px 12px 10px 0;
@form-item-bottom: 24px;


// title
@title-color: #241c38;
@title-bg: #ccc;
@title-height: 40px;
@title-padding: 0 15px;
// body
@body-padding: 15px;
@body-bg: #fff;
// footer
@footer-bg: #fff;
@footer-height: 40px;
@footer-padding: 0 15px;

// modal
@modal-header-bg: @title-bg;
@modal-header-padding: 14px 16px;
@modal-body-padding: 16px;
@modal-body-bg: @body-bg;
@modal-footer-padding: 12px 18px 12px 18px;
@modal-footer-button-left: 8px;
@modal-border: @border-color-base;


// list
@list-height: 36px;
@list-padding: 0 16px;
@list-color: @text-color;
@list-bg: @body-background;
@list-color-active: #fff;
@list-bg-active: @primary-color;
@list-border: @border-color-base;



// Slider
@slider-color: tint(@primary-color, 20%);
@slider-wrap-color: @border-color-split;
@slider-height: 4px;
@slider-margin: 16px 0;
@slider-button-wrap-size: 18px;
@slider-button-wrap-offset: -4px;
@slider-button-hover-color: @primary-color;
@slider-disabled-color: #ccc;
@slider-stop-color: @slider-disabled-color;

// bscalendar
@bscalendar-bg: #5C5C5C;
@bscalendar-header-bg: #868686;
@bscalendar-color: #fff;
@bscalendar-other-day: #bbbec4;
@bscalendar-day-hover: rgb(119, 119, 119);
@bscalendar-day-active: #00a5e3;

// bsScroll
@scroll-bg: #e5e5e5;
@scroll-bg-dragger: #ccc;
@scroll-bg-hover: #999999;
@scroll-width: 6px;

// bsVTree
@vtree-color: #bfbfbf;
@vtree-bg: #171717;
@vtree-bg-hover: rgb(39, 40, 34);
@vtree-bg-active: #434343;
@vtree-color-active: #00a5e3;

@bs-disabled-color: #ccc;